<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!-- 公共的CSS库 -->
<head th:include="/site/common/common_head :: commonHead"></head>
<title>关于 | Tumo Blog</title>

<body class="bg-grey" gtools_scp_screen_capture_injected="true">

<!--[if lt IE 8]>
<div class="browsehappy" role="dialog">
    当前网页 <strong>不支持</strong> 你正在使用的浏览器. 为了正常的访问, 请 <a href="http://browsehappy.com/" target="_blank">升级你的浏览器</a>。
</div>
<![endif]-->

<!-- header -->
<div th:replace="site/header :: header"></div>

<div id="app">
    <article class="main-content page-page">
        <div class="post-header">
            <h1 class="post-title" itemprop="name headline">友情链接</h1>
            <div class="post-data">
                <time datetime="2017-09-17" itemprop="datePublished">发布于 2018-11-05</time>
            </div>
        </div>
        <div id="post-content" class="post-content">
            <h2>友情链接</h2>
            <ul>
                <li th:each="link : ${links}"><a th:href="${link.url}" target="_blank" th:text="${link.lName}"></a></li>
            </ul>
            <h2>链接须知</h2>
            <blockquote>
                <p>请确定贵站可以稳定运营
                    原创博客优先，技术类博客优先，设计、视觉类博客优先
                    经常过来访问和评论，眼熟的</p>
            </blockquote>
            <h2>基本信息</h2>
            <ul>
                <li>网站名称：Tumo博客</li>
                <li>网站地址：http://tumo.tycoding.cn</li>
            </ul>
            <p>请在当页通过评论来申请友链，其他地方不予回复</p>
            <p>同时欢迎互换友链，在这个页面留言即可。 ^_^</p>
        </div>
    </article>
    <!-- 留言信息 -->
    <div class="comment-container">
        <div id="comments" ref="comments" class="clearfix">
            <span class="response"></span>
            <!-- 表单 -->
            <form method="post" id="comment-form" class="comment-form" onsubmit="return TumoComment.subComment();">
                <input hidden="hidden" name="articleId" id="articleId"/>
                <input hidden="hidden" name="articleTitle" id="articleTitle"/>
                <input hidden="hidden" name="sort" id="sort" th:value="${sort}"/>
                <input maxlength="12" name="author" id="author" class="form-control input-control clearfix" placeholder="姓名 (*)" value="" required/>
                <input type="email" name="email" id="email" class="form-control input-control clearfix" placeholder="邮箱 (*)" value="" required/>
                <input type="url" name="url" id="url" class="form-control input-control clearfix" placeholder="网址 (http://)" value=""/>
                <textarea name="content" id="content" class="form-control" placeholder="回复" required minlength="5" maxlength="2000"></textarea>
                <button class="submit" id="misubmit">提交</button>
            </form>

            <!-- 列表 -->
            <ol class="comment-list" th:if="${talkList.total} >= 0">
                <li th:each="comment : ${talkList.rows}" th:id="'li-comment-' + ${comment.parent.id}"
                    class="comment-body comment-parent comment-odd">
                    <div th:id="'comment-' + ${comment.parent.id}">
                        <div class="comment-view">
                            <div class="comment-header">
                                <img class="avatar" th:src="@{/public/author.png}" width="80" height="80">
                                <span class="comment-author">
                                    <a th:href="${comment.parent.url}" target="_blank" rel="external nofollow" th:text="${comment.parent.author}"></a>
                                </span>
                            </div>
                            <div class="comment-content">
                                <span class="comment-author-at"></span>
                                <p><p th:text="${comment.parent.content}"></p></p>
                            </div>
                            <div class="comment-meta">
                                <time class="comment-time" th:text="${#dates.format(comment.parent.time, 'yyyy-MM-dd')}"></time>
                                <span class="comment-reply">
                                <a rel="nofollow" th:onclick="'javascript:TumoComment.reply(\'' + ${comment.parent.author} + '\',\'' + ${comment.parent.id} + '\');'">回复</a>
                            </span>
                            </div>
                        </div>
                    </div>
                    <div th:if="${comment.childrenList} != '[]'" class="comment-children">
                        <ol class="comment-list">
                            <li th:each="item : ${comment.childrenList}" th:id="'li-comment-' + ${item.id}"
                                class="comment-body comment-child comment-level-odd comment-odd">
                                <div th:id="'comment-' + ${item.id}">
                                    <div class="comment-view">
                                        <div class="comment-header">
                                            <img class="avatar" th:src="@{/public/author.png}" width="80" height="80">
                                            <span class="comment-author comment-by-author">
                                            <a th:href="${item.url}" target="_blank" rel="external nofollow" th:text="${item.author}"></a>
                                        </span>
                                        </div>
                                        <div class="comment-content">
                                        <span class="comment-author-at">
                                            <a th:href="'#comment-' + ${item.cId == 0 ? item.pId : item.cId}" th:text="${item.authorId}"></a>
                                        </span>
                                            <p><p th:text="${item.content}"></p></p>
                                        </div>
                                        <div class="comment-meta">
                                            <time class="comment-time" th:text="${#dates.format(item.time, 'yyyy-MM-dd')}"></time>
                                            <span class="comment-reply">
                                            <a rel="nofollow" th:onclick="'javascript:TumoComment.reply(\'' + ${item.author} + '\',\'' + ${item.pId} + '\',\'' + ${item.id} + '\');'">回复</a>
                                        </span>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ol>
                    </div>
                </li>
            </ol>
            <div class="lists-navigator clearfix">
                <ol class="page-navigator" th:if="${talkList.total > 0}">
                    <li class="prev" th:if="${cp} gt '1'">
                        <a th:href="'?cp=' + ${cp < 1 ? cp : cp-1} + '#comments'">←</a>
                    </li>
                    <li th:each="i : ${#numbers.sequence(1, talkList.total)}">
                        <a th:style="${i == cp ? 'color: #eb5055;' : ''}" th:href="'?cp=' + ${i} + '#comments'" th:text="${i}"></a>
                    </li>
                    <li class="next" th:if="${cp < talkList.total}">
                        <a th:href="'?cp=' + ${cp < talkList.total ? cp+1 : talkList.total} + '#comments'">→</a>
                    </li>
                </ol>
            </div>
        </div>
    </div>

    <!-- footer -->
    <div th:replace="site/footer :: footer"></div>
</div>
<!-- 公共的JS库 -->
<div th:include="site/common/onload_js ::onloadJS"></div>
</body>
<script type="text/javascript" th:src="@{/site/js/link.js}"></script>
</html>